/*手机端样式*/
img{-webkit-user-select:​ none}
.main{ width:100%;height:100%;min-width:300px; max-width:640px;margin:0 auto;-webkit-box-sizing: border-box; -moz-box-sizing:border-box; position:relative;overflow: hidden;}

/*上下滚动开始*/
.m-page { position:absolute; left:0; top:0%; height:100%; width:100%; background:#fff; }
.m-page.show { z-index:10; display:block; }
.m-page.hide { z-index:5; display:none; }
.m-page.active { z-index:15; display:block; }

.u-arrow { position: fixed; bottom: 10px; left:50%;z-index: 150; width: 24px; height: 14px; margin-left: -7px; }
.u-arrow img { position: absolute; top: 50%; left: 50%; margin: -7px 0 0 -14px; width: 24px; height: 14px; background-position: 0 -82px;
	-webkit-animation: start 1.5s infinite ease-in-out;
	   -moz-animation: start 1.5s infinite ease-in-out;
	        animation: start 1.5s infinite ease-in-out;
}
@-webkit-keyframes start {
	0%,30% {opacity: 0;-webkit-transform: translate(0,10px);}
	60% {opacity: 1;-webkit-transform: translate(0,0);}
	100% {opacity: 0;-webkit-transform: translate(0,-8px);}
}
@-moz-keyframes start {
	0%,30% {opacity: 0;-moz-transform: translate(0,10px);}
	60% {opacity: 1;-moz-transform: translate(0,0);}
	100% {opacity: 0;-moz-transform: translate(0,-8px);}
}
@keyframes start {
	0%,30% {opacity: 0;transform: translate(0,10px);}
	60% {opacity: 1;transform: translate(0,0);}
	100% {opacity: 0;transform: translate(0,-8px);}
}
/*上下滚动结束*/

/*左右滚动开始*/
.sl-slider-wrapper {
	width: 100%;
	height: 100%;
	margin: 0 auto;
	position: relative;
	overflow: hidden;
}

.sl-slider {
	position: absolute;
	top: 0;
	left: 0;
}

.sl-slide,
.sl-slides-wrapper,
.sl-slide-inner {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
} 

.sl-slide {
	z-index: 1;
}


.sl-content-slice {
	overflow: hidden;
	position: absolute;
	-webkit-box-sizing: content-box;
	-moz-box-sizing: content-box;
	box-sizing: content-box;
	background: #fff;
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	-o-backface-visibility: hidden;
	-ms-backface-visibility: hidden;
	backface-visibility: hidden;
	opacity : 1;
}


.sl-slide-horizontal .sl-content-slice {
	width: 100%;
	height: 50%;
	left: -200px;
	-webkit-transform: translateY(0%) scale(1);
	-moz-transform: translateY(0%) scale(1);
	-o-transform: translateY(0%) scale(1);
	-ms-transform: translateY(0%) scale(1);
	transform: translateY(0%) scale(1);
}

.sl-slide-horizontal .sl-content-slice:first-child {
	top: -200px;
	padding: 200px 200px 0px 200px;
}

.sl-slide-horizontal .sl-content-slice:nth-child(2) {
	top: 50%;
	padding: 0px 200px 200px 200px;
}


.sl-slide-vertical .sl-content-slice {
	width: 50%;
	height: 100%;
	top: -200px;
	-webkit-transform: translateX(0%) scale(1);
	-moz-transform: translateX(0%) scale(1);
	-o-transform: translateX(0%) scale(1);
	-ms-transform: translateX(0%) scale(1);
	transform: translateX(0%) scale(1);
}

.sl-slide-vertical .sl-content-slice:first-child {
	left: -200px;
	padding: 200px 0px 200px 200px;
}

.sl-slide-vertical .sl-content-slice:nth-child(2) {
	left: 50%;
	padding: 200px 200px 200px 0px;
}


.sl-content-wrapper {
	position: absolute;
}

.sl-content {
	width: 100%;
	height: 100%;
	background: #fff;
}

.sl-slide-horizontal .sl-slide-inner {
	background: #ddd;
}

.sl-slide-vertical .sl-slide-inner {
	background: #ccc;
}


.main .sl-slider-wrapper {width: 100%;height:100%;overflow: hidden;position: relative;}

.main .bg-img {
	display:block;
	padding: 0px 0px;
	-webkit-box-sizing: content-box;
	-moz-box-sizing: content-box;
	box-sizing: content-box;
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	-webkit-background-size: 100% 100%;
	-moz-background-size: 100% 100%;
	background-size: 100% 100%;
	background-position: center center;
}
.jt_left{position:absolute;top:50%;display:block;width:30px;height:30px;margin-top:-15px;z-index:100;
right:8px;-webkit-animation: move 2s infinite;	}
.jt_left img{width:30px;height:30px;}


@-webkit-keyframes move  {
  from { right:8px; }
  to { right:50px; }
}
/*左右滚动开始*/


/*画布效果*/
#cas{
	position:absolute;
	z-index:669;
	width: 100%;
	height: 100%;
	opacity: 1;
	-webkit-transition:opacity .5s;
	-ms-transition:opacity .5s;
	-moz-transition:opacity .5s;
}
		
.noOp{
	opacity: 0 !important;
}

/*上下撕裂*/
.jt_up{position:absolute;bottom:5px;display:block;width:30px;height:30px;z-index:100;
left:50%;margin-left:-15px;-webkit-animation: move2 2s infinite;}
.jt_up img{width:30px;height:30px;}

@-webkit-keyframes move2  {
  from { bottom:5px; }
  to { bottom:15px; }
}











